<template>
	<view id="apps">
		
		
			
		<!-- big_text -->
		<view class="big_text">
			<text class="t">189****6656</text>
			<text class="s">认证服务由中国电信提供</text>
		</view>
				
		
		<!-- btns -->
		<view class="btns">
			<button>本机号码一键登录</button>
			<button class="gray">其他号码手机登录</button>
		</view>
				
				
		
		<!-- 版权 -->
		<view class="copyright">
			<text>登入及表示同意</text>
			<text class="link">《隐私政策》</text>
			<text>和</text>
			<text class="link">《服务条款》</text>
		</view>
		
		
		<!-- bg -->
		<view class="bg">
			<image src="/static/images/login_bg.png" mode="widthFix"></image>
		</view>
						
			
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	
		page{
			background: #fff;
		}

		#apps{

			display: flex;
			flex-flow: column wrap;
			
			
			// .big_text
			.big_text{
				display:block;
				text-align:cener;
				margin-top:300rpx;
				
				.t{
					font-size: 56rpx;
					color: #333;
					font-weight: bold;
					display: block;
					text-align: center;
				  }
				.s{
					font-size:24rpx;
					color: #999;
					text-align: center;
					display: block;
					margin-top: 10rpx;
				   }
			}
			
			
			// btns
			.btns{
				margin-top: 100rpx;
				padding: 0 92rpx;
				box-sizing: border-box;
				
				button{
					background: #DE4335;
					box-shadow: 0px 6rpx 12rpx rgba(222, 67, 53, 0.5);
					opacity: 1;
					border-radius: 44rpx;
					margin-bottom: 40rpx;
					color: #fff;
					font-weight: 36rpx;
					
					&.gray{
					background: #f6f6f6!important;
					box-shadow: 0px 6rpx 12rpx rgba(246, 246, 246, 0.5);
					color: #333;
					}
					
					&::after{
						border: 0;
					}
					&:hover{
						opacity: .9;
					}
					
				}
				
			}
			
			
			// copyright
			.copyright{
				position: fixed;
				left: 0;
				right: 0;
				bottom: 50rpx;
				display: block;
				text-align: center;
				font-size: 22rpx;
				color: #999;
				.link{
					color: #EA445C;
				}
			}
			
			
			// bg
			.bg{
				position: fixed;
				left: 0;
				right: 0;
				bottom: 0;
				margin: auto;
				image{
					width: 570rpx;
					height: auto;
				}
			}
		
		
			
			
		}
	

</style>
